<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">

<body data-type="index">
<div class="am-g tpl-g">
    <!-- 头部 -->
    <jsp:include page="common/header.jsp"></jsp:include>
    <!-- 风格切换 -->

    <!-- 侧边导航栏 -->
    <jsp:include page="common/memu.jsp"></jsp:include>


    <!-- 内容区域 -->
    <div class="tpl-content-wrapper">

        <div class="row-content am-cf">
            <div class="row  am-cf">

                <div class="row">

                    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                        <div class="widget am-cf">
                            <div class="widget-head am-cf">
                                <div class="widget-title am-fl">存款操作</div>
                                <div class="widget-function am-fr">
                                    <a href="javascript:;" class="am-icon-cog"></a>
                                </div>
                            </div>
                            <div class="widget-body am-fr">

                                <form class="am-form tpl-form-line-form">


                                    <div class="am-form-group">
                                        <label for="cardSelect" class="am-u-sm-3 am-form-label">银行卡 <span class="tpl-form-line-small-title"></span></label>
                                        <div class="am-u-sm-9">
                                            <select id="cardSelect" data-am-selected="{searchBox: 1}" style="display: none;">
                                                <option value="1">888888</option>
                                                <option value="2">7777</option>
                                                <option value="3">66666</option>
                                                <option value="4">55555</option>
                                            </select>

                                        </div>
                                    </div>

                                    <div class="am-form-group">
                                        <label for="password" class="am-u-sm-3 am-form-label">密码 <span class="tpl-form-line-small-title"></span></label>
                                        <div class="am-u-sm-9">
                                            <input type="password" class="tpl-form-input" id="password" placeholder="请输入4位银行卡密码">
                                            <small></small>
                                        </div>
                                    </div>

                                    <div class="am-form-group">
                                        <label for="amount" class="am-u-sm-3 am-form-label">金额 <span class="tpl-form-line-small-title"></span></label>
                                        <div class="am-u-sm-9">
                                            <input type="text" class="tpl-form-input" id="amount" placeholder="请输入存款金额">
                                            <small></small>
                                        </div>
                                    </div>

                                    <div class="am-form-group">
                                        <div class="am-u-sm-9 am-u-sm-push-3">
                                            <button onclick="deposit();" type="button" class="am-btn am-btn-primary tpl-btn-bg-color-success ">存款</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>





            </div>




        </div>



    </div>
</div>
</div>
</div>

<div class="am-modal am-modal-no-btn" tabindex="-1" id="your-modal">
    <div class="am-modal-dialog">
        <div class="am-modal-hd">
            <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
        </div>
        <div class="am-modal-bd">
            操作成功
        </div>
    </div>
</div>

<script src="assets/js/amazeui.min.js"></script>
<script src="assets/js/amazeui.datatables.min.js"></script>
<script src="assets/js/dataTables.responsive.min.js"></script>
<script src="assets/js/app.js"></script>

<script>
    function loadMyCard() {
        $.get("/card", {
            action : 'queryCards'
        }, function (xx) {
            if (xx.code != 1000) {
                alert(xx.message);
                return;
            }

            var msg = '<option value="no">请选择银行卡</option>';
            var cards = xx.data;
            for (var i=0; i<cards.length; i++) {
                var card = cards[i];
                msg += ' <option value="'+card.cardId+'">'+card.cardNum+'</option>';
            }
            $('#cardSelect').html(msg);
        });
    }

    loadMyCard();

    function deposit() {
        $.get("/card", {
            action : 'deposit',
            cardId : $('#cardSelect').val(),
            password : $('#password').val(),
            amount : $('#amount').val()
        }, function (xx) {
            if (xx.code != 1000) {
                alert(xx.message);
                return;
            }

          alert('存款成功!');
            window.location.href = '/toPage?pageName=index';
        });
    }


    $('#depositA').addClass("active")

</script>

<%
    request.getAttribute("color");
%>

</body>

</html>